How to Carry Out a Successful WordPress Site Redesign

Launched a few years ago, your website is starting to show signs of fatigue. You’re convinced: it needs a fresh coat of paint. 

Its content is outdated. The mobile display leaves something to be desired. Pages load too slowly. Worse still: the traffic generated from Google is declining.

No doubt about it: a WordPress site redesign is necessary! Yes, but here’s the thing. You know this technical operation can be very risky if it isn’t carried out properly. 

This article is here to help. By the end of your reading, you’ll know all the steps to follow to successfully carry out a professional redesign without wrecking your existing site. 

And thanks to our complete tutorial, suited to both beginners and more experienced users, you’ll have concrete examples of what to do AND what not to do during a redesign.

What is a WordPress site redesign?

A WordPress site redesign is a technical process aimed at improving and modernizing a website with two main goals: 

1. Adapting to your users’ needs.
2. Meeting your objectives: making more sales on your online store, presenting your services more clearly, getting more quote requests, encouraging downloads of a white paper, boosting sign-ups to your newsletter, etc. 

Starting a redesign process can enable you to take action on several levels: 

• modify the user interface (UI) to improve usability and clarity in navigation; 
• improve performance (the loading speed of your pages) to make the user experience (UX) more enjoyable;
• optimize organic search ranking (SEO) to increase visits and maximize traffic to your pages; 
• update your content to reflect changes in your core business; 
• integrate new features.

Depending on your expectations, your technical skills, the time you have available, and your budget, you can take charge of one or more of the aspects presented above. 

The question remains how to manage all this at once. Find out how to proceed in the following sections. 

Phase 1: What steps should be followed before a redesign?

Foreword: The various WordPress site redesign steps presented below are, in a way, an ideal framework to follow. Think of them as a complete roadmap that can nevertheless be flexible. For example, there will be no need for you to create mockups or wireframes, or to integrate a new design, if you “simply” want to rework your website’s SEO. Be flexible and agile, and adapt the methods presented in this article according to the context. 

Define the objectives of the WordPress site redesign

The importance of auditing the existing site 

First of all, it is essential to identify why you want to carry out a WordPress site redesign. This will allow you to determine whether this operation is necessary and justified. 

To do this, we recommend evaluating your existing site through a WordPress audit. You will identify blocking points and areas for improvement.

To help you, focus first and foremost on the “basic” building blocks of a professional, high-performing WordPress site, by asking yourself questions at several levels: 

• structure and web design. Is navigation intuitive? Is the user experience well thought out? Does the web design reflect your brand image? Is it suited to your style guide  ;
• performance. Do your pages load quickly? Use a tool such as Google PageSpeed Insights to find out. 
• SEO strategy. Is the traffic generated on your site meeting your expectations? Has it been declining for several months? Is the website optimized for search engines? Use tools such as Google Analytics and Google Search Console, for example, to analyze your traffic and identify blocking points. 
• security. Is your WordPress CMS protected against viruses, malware, and other security vulnerabilities? Have you implemented the right best practices in this area?
• content. Do your pages reflect the evolution of your business as closely as possible? If you have a blog, do your articles meet the search intent and needs of your users?;
• features. Do you want to add new options (creating an online store with WooCommerce, switching to multilingual, etc.)? Are the ones already on your site still working?

Also think about time and budget

Depending on what you discover, you will be able to define your aspirations more easily, which you can list in a collaborative work tool such as Google Docs, Google Sheets, Trello or Asana.

For example, if you feel that your site is not receiving enough monthly visits, which negatively affects your conversions, the main goal of your WordPress site redesign will be to improve the SEO strategy.

At the same time, don’t forget to think about the budget you want to allocate to your redesign. The project will, for example, be more expensive if you hire a professional rather than handling it on your own.

Also remember to factor in the costs of the various tools, such as WordPress or a page builder like Divi Builder or Elementor, if you want to create a new web design.  

Finally, link your goals to the time factor. What availability do you have to carry out this project, and above all, within what timeframe can you complete it?

Our tip: For even greater clarity, set goals using SMART indicators (specific, measurable, achievable, realistic, and time-bound). As part of a redesign whose main objective is to improve organic SEO, a SMART goal could be: “I want to increase organic traffic to my blog by 30% during the first half of the current year.” 

Create the new structure of your site

The site structure

Once your goals have been defined, tackle an essential element of a WordPress site redesign: the structure of your website.

This refers to the way your content is organized, categorized, and linked together.

This “skeleton,” organized in the form of a diagram, notably makes it possible to: 

• improve the user experience, by allowing your visitors to easily find what they are looking for thanks to smooth and user-friendly navigation;
• to optimize SEO, thanks to a hierarchical structure organized around well-targeted themes. This notably helps make it easier for search engines like Google to crawl and index your site.

To design an effective site structure, rely on the objectives you defined beforehand. Then take your target audience into account, in order to meet their needs and solve their problems.

To do this, create a persona – a fictional representation of your ideal customer – using a dedicated tool like this one. 

Finally, study what your competitors offer and draw inspiration from what works well for them to apply it in your own way on your own WP site. 

As for the tools to use to shape your site structure, we recommend using dedicated software such as GlooMaps (free), MindMeister (freemium), or DYNO Mapper (paid). 

The wireframes and mockups for your WordPress site redesign

Right after that, move on to the graphic representation stage of your site structure. This will allow you to visualize the appearance of your website with varying levels of detail. 

In order, we first recommend that you design wireframes. These are functional, schematic sketches showing the various structural elements of a page.

They allow you to represent the user interface (UI) more clearly and in greater detail than with your site structure.

You can design your wireframes with online tools like MockFlow (free), or Balsamiq (paid).

If needed, you can integrate your design into mockups using a tool such as Figma (freemium), Sketch (paid), or Adobe XD (paid).
This step will be essential if you want to carry out a complete visual redesign of your site from A to Z. In that case, consider redefining or creating brand guidelines. 

If you only want to tweak certain visual elements of an existing theme, you can skip this mockup step. It’s up to you. 

Our advice: In addition to the tools you will need to work on your site’s web design, remember to take stock of the technical solutions to use on your redesigned site. If you change themes, choose a fast, lightweight, and scalable theme such as Astra or GeneratePress. Also think about the plugins you need (for example, see our selection of the best security plugins).  

Create a redirection plan

When redesigning your WordPress site, there is a good chance that changes will occur in the structure of your URLs. This will be the case, for example, if: 

• you delete pages; 
• you create new pages; 
• you modify the URL of certain pages, categories, or tags; 
• you switch to HTTPS, etc.

In order to retain your current traffic and avoid the appearance of 404 errors that will harm your SEO efforts and the user experience, creating a redirection plan is essential.

To create it, use a standard Excel file divided into three columns. In it, you will list:

• the URLs subject to changes (old URLs); 
• the new URLs (those that will be present on the redesigned site);
• the redirects to implement. A 301 redirect makes it possible, for example, to avoid a 404 error while transferring the popularity of your old pages to the new ones. 

Our advice: If you have a small site (brochure site, blog) with a few dozen URLs, you can proceed manually. For larger sites, such as a large ecommerce site, opt for a complete audit with dedicated tools such as Screaming Frog, Semrush or Ahrefs. 

Create a specifications document

If you are carrying out a WordPress site redesign project for a client, we recommend compiling most of the steps we have just presented to you in a specifications document. 

This is a written document that presents the major elements related to a WordPress site creation or redesign project.

It notably details the needs, constraints, ideas, concepts, and goals of the person or company wishing to design or redesign a website. To find out how to put one together, see our dedicated guide on the subject.  

Now that your WordPress site redesign project is clearly mapped out, see how to technically launch the operations. 

Phase 2: launching your WordPress site redesign 

Define and set up the appropriate working environment

The first piece of advice we can give you is to avoid at all costs—except for very minor tweaks—working on your live site. 

This way, you protect yourself against the possibility of encountering bugs and other malfunctions that could make your site unavailable and negatively impact your brand image. 

To gain peace of mind and work calmly, two main options are available to you:  

1. Carry out the redesign of your WordPress site locally, that is, on your machine. To do this, rely on a tool such as WAMP, Local or DevKinsta.
2. Use a development environment. You can either work on a subdomain or a subdirectory created in your hosting provider’s admin interface. Or set up a staging environment using a plugin such as WP Staging, for example.

Our advice: If you are a beginner WordPress user or reluctant about technical aspects, starting with a local working environment is a good compromise. 

As for the actions to take, everything will depend on what you want to do: 

• either start from scratch and recreate a new site. In this case, you will need to install WordPress, configure it, and set up your theme and plugins. We recap what you need to do in this article;
• or copy an existing site and modify it according to the intentions you defined earlier. To copy your site from the online environment to the local one, use a plugin such as All-in-One WP Migration or Duplicator, for example. 

Our advice: Before carrying out any technical changes, back up your site (files + database)! If there is a problem, you will be able to restore it with one click. You can use a WordPress backup plugin like UpdraftPlus, or a complete maintenance solution like WP Umbrella. 

Integrate the design, content, and features

Once your working environment is ready, the range of actions to take will depend, once again, on your initial goals.

While it is impossible to detail all possible scenarios here, here are a few general cases that may guide you when it is time to take action: 

• implement the design created in your mockups on the site to be redesigned. If you are working with the WordPress site editor (Gutenberg), for example, you will need to create blocks and other page templates. The logic will be broadly the same with a page builder;
• add the features of your choice: contact form, search bar, pop-ups, ecommerce store, GDPR compliance, etc. To do this, configure and test the appropriate plugins;
• integrate and/or modify your content, whether on your strategic pages or within your blog. We are of course thinking of text, but also images and other videos. Watch their file size! For example, optimize your images using a plugin such as Imagify.  
• implement SEO best practices (meta tags, optimized URLs, XML sitemap, robots.txt file, etc.). To do this, use a dedicated plugin such as Yoast SEO, Rank Math or SEOPress.

Our advice: Before creating new content or editing text already on the site to be redesigned, develop an SEO strategy. For example, think about the keywords you want your target audiences to find you for using dedicated tools such as Semrush, Ahrefs, or Google Keyword Planner. 

You are nearing the end of this laborious WordPress site redesign process. Even if everything seems to be running smoothly, it is wise to take a few more precautions before definitively publishing your new site online. That is the purpose of the final part of this content. 

Phase 3: Publishing the redesign in 4 steps 

Move your test site to pre-production (and test it)

To begin this third phase of redesigning a WordPress site, move your test site to a pre-production environment (also called staging).

In this case, you move the site you have just redesigned locally – for example – to an online server (with your trusted hosting provider) that has the same characteristics as the one your site will have once in production.

Only you and your client will have access to it, not your visitors. You will be able to test and make sure everything is working properly before the final launch. 

Here are the steps to follow to create a pre-production environment: 

• back up your production site (files + database); 
• create a pre-production environment by configuring either a subdomain (e.g.: staging.yoursite.com) or a subdirectory (e.g.: yoursite.com/staging);  
• clone your site to the staging environment either manually or using one of the migration plugins mentioned earlier; 
• test your site. In IT jargon, this is called acceptance testing. Check that all the site’s features are working properly (buttons, links, forms, menu, plugins, etc.). Take the opportunity to make sure your site displays correctly on the main browsers and on different screen sizes (responsive aspect).

Put your site into maintenance mode 

Have you carried out the usual checks? It’s time to put your old site into maintenance mode, just before moving from pre-production to production. 

Putting your site into maintenance mode has several advantages:

• you do not harm your visitors’ user experience, since your site will be unavailable during the transition (from pre-prod to prod);
• you communicate transparently with your audience by telling them that maintenance is underway for a given period of time;
• if errors or bugs occur, no one will know (except you) with a site in maintenance mode. This prevents you from damaging your brand image. 

What solutions are there for switching to maintenance mode during a WordPress site redesign?

To put your site into maintenance mode, you can: 

• use a dedicated plugin such as SeedProd or Maintenance; 
• use a maintenance page template offered by your theme or your favorite page builder; 
• add a piece of code to your .htaccess file, or to your child theme’s functions.php file; 
• enable WordPress maintenance mode from the administration interface provided by your host, such as cPanel.

Deploy the new site online

This time, everything is ready. You can (finally) migrate your site online by following these steps: 

• back up your site. We’re repeating ourselves on this point, but you can never be too careful;
• move the site from the preproduction environment to the production environment. Are you an experienced technician? You can do it manually if you’re sure you know what you’re doing. To avoid mistakes and go even faster, use a plugin like All-in-One WP Migration or Duplicator. 
• reactivate your extensions and third-party tools, such as your cache, security, and traffic analysis plugins like Google Analytics; 
• redirect all the URLs included in your redirection plan. To perform a 301 redirect (the most common type), use either the Redirection plugin, or your favorite SEO plugin (Rank Math, for example, offers this option for free); 
• test your site once again using the advice given above. Check that everything is configured correctly and test everything!

Our advice: Some migration plugins limit you in terms of the size of files to migrate. If you have a site with substantial assets, you may be blocked with their free version. In that case, switch to their premium version or get help from an expert like Maintenance WP to migrate manually.
And if possible, do not deploy your site online over the weekend or the day before a weekend. If there is a problem, you could find yourself in a difficult situation…

Follow up after your WordPress site redesign

Once your WordPress site redesign is live, remember to carry out a few essential post-launch actions: 

• monitor how your site is working, especially in the days and hours following the redesign. Quickly fix any bug or issue identified; 
• pay attention to feedback from your users, who may report possible malfunctions to you;
• check your site’s performance (loading speed, SEO traffic, conversions, etc.); 
• ensure regular maintenance of your WordPress site. Back up your site frequently and update it as soon as possible (plugins, themes, and WordPress core); 
• communicate about the redesign of your WordPress site through your preferred channels: newsletter, social media, etc.; 
• check that you have achieved your pre-redesign goals, then adjust your strategy based on your results.

Summary

Thanks to a WordPress site redesign, you will modernize and optimize your website.

This technical and time-consuming process involves in-depth analysis, careful planning, and agile deployment to ensure a smooth transition to an improved, high-performing site.

In this article, you discovered all the steps to follow to carry out an effective and professional redesign before, during, and after its launch. 

As you have seen, following best practices and having solid technical skills are necessary to avoid breaking your site and losing all your current traffic. 

Would you like to receive advice and support from a recognized agency with expertise in WP site redesign? 

As a specialist in this field, Maintenance WP will offer you a tailor-made solution that meets your needs quickly, professionally, and effectively.